<style>

</style>
<div id="mainContent" class="easyui-layout" data-options="fit:true">
    <div data-options="region:'north'" style="overflow: hidden;height: 140px;">
        <div class="easyui-panel" data-options="border:0">
            <fieldset style="padding: 10px;margin: 4px; border:1px solid #f0ad4e">
                <legend>查询</legend>
                <div style="margin-bottom:20px;text-align: right">
                    <input id="orderNum" name="orderNum" class="easyui-textbox theme-textbox-radius" label="订单号:" data-options="prompt:'请输入字订单号...'" style="width:40%;"/>
                    <input id="companyId" name="companyId" class="easyui-combobox theme-textbox-radius" data-options="
                    url:'${base}/admin/company/findCompany.do',
                    required:true,
                    editable:false,
                    valueField:'companyId',
                    textField:'companyName',
                    onLoadSuccess: function(){
                        var data = $(this).combobox('getData');
                        $(this).combobox('select', data[0].companyId);
                    }
            " style="width:30%"/>
                    <select id="orderType" name="orderType" class="easyui-combobox theme-textbox-radius" label="订单状态:" style="width:25%;" data-options="editable:false">
                        <option value="-1" selected="selected">全部</option>
                        <option value="1">未付款</option>
                        <option value="2">已付款</option>
                        <option value="3">订单关闭</option>
                        <option value="4">申请退款</option>
                        <option value="5">退款完成</option>
                    </select>
                </div>
                <div style="text-align: right">
                    <input id="startDate" name="startDate"  class="easyui-datebox theme-textbox-radius" label="订单开始日期:" style="width:26%;" data-options="prompt:'请选择开始日期',editable:false,required:false,formatter:dateFormatter,onSelect:onSelected"/>
                    <input id="endDate" name="endDate"  class="easyui-datebox theme-textbox-radius" label="订单结束日期:" style="width:26%;" data-options="prompt:'请选择结束日期',editable:false,required:false,formatter:dateFormatter,validType:'equalStartDate[\'#startDate\']'"/>
                    <a id="queryOrderBtn" href="#" class="easyui-linkbutton button-orange button-xs l-btn l-btn-small">
                        <span class="l-btn-left">
                            <span class="l-btn-text">
                                <i class="iconfont">&#xe6ac;</i> 查询
                            </span>
                        </span>
                    </a>
                </div>
            </fieldset>
        </div>
    </div>
    <div data-options="region:'center'">
        <table id="orderListDg" title="" class="easyui-datagrid"
               data-options="
                url: '${base}/admin/order/dataList.do',
                fit:true,
                lines: true,
                rownumbers: false,
                striped: true,
                animate:true,
                singleSelect : false,
                showFooter: true,
                pagination: true,
                idField: 'orderId',
                toolbar: '#tb',
                onLoadSuccess: loadSuccess,
                onDblClickRow: showOrderInfo,
                queryParams: {
                    orderId: '',
                    company: '',
                    orderStat: '',
                    startD: '',
                    endD: ''
                }
            " border="0">
            <thead data-options="frozen:true">
            <tr>
                <th data-options="field:'orderId'" width="5%">订单号</th>
                <th data-options="field:'userName'" width="5%">用户名</th>
                <th data-options="field:'goodsName'" width="8%">商品</th>
                <th data-options="field:'goodsPrice',formatter:fmtPay" width="3%">价格</th>
                <th data-options="field:'createTime'" width="8%">下单时间</th>
                <th data-options="field:'transactionId'" width="8%">交易号</th>
                <th data-options="field:'payTime'" width="8%">支付时间</th>
                <th data-options="field:'totalFee',formatter:fmtPay" width="3%">应付金额</th>
                <th data-options="field:'cashFee',formatter:fmtPay" width="3%">实际支付</th>
                <th data-options="field:'bankType'" width="8%">付款方式</th>
                <th data-options="field:'resultCode'" width="5%">支付状态</th>
                <th data-options="field:'mobileOS'" width="3%">手机系统</th>
                <th data-options="field:'appVersion'" width="3%">微信版本</th>
                <th data-options="field:'networkType'" width="3%">网络环境</th>
                <th data-options="field:'dataStatus',formatter:fmtControl" width="5%">订单状态</th>
            </tr>
            </thead>
        </table>
    </div>
</div>

<div id="tb">
    <a href="javascript:refundPay()" class="easyui-linkbutton" data-options="iconCls:'icon-edit',plain:true">审批退款</a>
</div>

<div id="orderInfoDialog" style="pading: 8px;">
    <table class="table table-striped" width="100%" border="0" cellspacing="0" cellpadding="0" style="font-size: 12px;">
        <tr style="height:23px; line-height:23px;">
            <td width="30%">订单号</td>
            <td width="70%"><span id="orderId"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">用户名</td>
            <td width="70%"><span id="userName"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">商品</td>
            <td width="70%"><span id="goodsName"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">价格</td>
            <td width="70%"><span id="goodsPrice"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">下单时间</td>
            <td width="70%"><span id="createTime"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">交易号</td>
            <td width="70%"><span id="transactionId"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">支付时间</td>
            <td width="70%"><span id="payTime"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">应付金额</td>
            <td width="70%"><span id="totalFee"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">实际支付</td>
            <td width="70%"><span id="cashFee"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">付款方式</td>
            <td width="70%"><span id="bankType"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">支付状态</td>
            <td width="70%"><span id="resultCode"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">支付环境</td>
            <td width="70%">手机系统：<span id="mobileOS"></span>->微信版本：<span id="appVersion"></span>->网络：<span id="networkType"></span></td>
        </tr>
        <tr style="height:23px; line-height:23px;">
            <td width="30%">订单状态</td>
            <td width="70%"><span id="dataStatus"></span></td>
        </tr>
    </table>
</div>

<script>

    $(function(){
        $('#queryOrderBtn').bind('click', function () {
            var orderId = $('#orderNum').textbox('getValue');
            var company = $('#companyId').combobox('getValue');
            var orderType = $('#orderType').combobox('getValue');
            var startD = $('#startDate').datebox('getValue');
            var endD = $('#endDate').datebox('getValue');

            if (startD!=null && startD!='') {
                var flag = (endD!=null && endD!='');
                if (!flag) {
                    showMsg('提示', '结束日期不可以为空');
                    return ;
                }
            }

            var orderList = $('#orderListDg').datagrid('options').queryParams;
            orderList.orderId = orderId;
            orderList.company = company;
            orderList.orderType = orderType;
            orderList.start = startD;
            orderList.end = endD;
            $('#orderListDg').datagrid({'pageNumber':1});
            $('#orderListDg').datagrid('reload');
        });

        $('#orderInfoDialog').dialog({
            title: '订单信息',
            iconCls: 'icon-order',
            width: 500,
            height: 640,
            closed: true,
            modal: true,
            style: {padding: 10},
            buttons: [{
                text: '关闭',
                iconCls: 'icon-cancel',
                onClick: function(){
                    $('#orderInfoDialog').dialog('close');
                }
            }]
        });
    });

    function fmtPay(val,row) {
        return (val/100).toFixed(2);
    }


    function fmtControl(val,row) {
        var result = '<span style="color:#cccccc">未知</span>';
        switch (parseInt(val)) {
            case 1:
                result = '<span style="color:#ff8c00">未支付</span>';
                break;
            case 2:
                result = '<span style="color:#008000">已支付</span>';
                break;
            case 3:
                result = '<span style="color:#ff4136">订单关闭</span>';
                break;
            case 4:
                result = '<span style="color:#e03997">订单退款中</span>';
                break;
            case 5:
                result = '<span style="color:#4ed964">订单退款成功</span>';
                break;
        }
        return result;
    }
    
    function loadSuccess(data) {

    }

    function onSelected(date){
        $('#endDate').datebox('reset');
    }

    function dateFormatter(date){
        var y = date.getFullYear();
        var m = date.getMonth()+1;
        var d = date.getDate();
        return y+'-'+(m<10?('0'+m):m)+'-'+(d<10?('0'+d):d);
    }

    function showOrderInfo(index, order) {
        $('#orderId').text(order.orderId);
        $('#userName').text(order.userName);
        $('#goodsName').text(order.goodsName);
        $('#goodsPrice').text((order.goodsPrice/100).toFixed(2));
        $('#createTime').text(order.createTime);
        $('#transactionId').text(order.transactionId);
        $('#payTime').text(order.payTime);
        $('#totalFee').text((order.totalFee/100).toFixed(2));
        $('#cashFee').text((order.cashFee/100).toFixed(2));
        $('#bankType').text(order.bankType);
        $('#resultCode').text(order.resultCode);
        $('#mobileOS').text(order.mobileOS);
        $('#appVersion').text(order.appVersion);
        $('#networkType').text(order.networkType);
        var stat = fmtControl(0, order.dataStatus);
        $('#dataStatus').text(stat);

        $('#orderInfoDialog').dialog('open');
    }
    
    function refundPay() {
        var data = $('#orderListDg').datagrid('getSelections');
        if (data==null||data.length<1) {
            showMsg('操作失败','请选择要审批的退款记录');
            return;
        }

        var orderIds = new Array();
        $(data).each(function (i, e) {
            if(parseInt(e.dataStatus)!=4) {
                showMsg('操作失败','请不要选择未申请退款的订单');
                orderIds.length = 0;
                return false;
            }

            orderIds.push(e.dataStatus);
        });

        if (orderIds.length>0) {
            $.post('${base}/admin/order/refundPay.do', {orderId:orderIds.join(',')},
                    function(result){
                    if(result.ok) {
                        showMsg('操作成功', '用户退款审核成功,请尽快在微信商户发起退款.');
                    } else {
                        showMsg('操作失败', '用户退款审核失败,请稍后再试.');
                    }
            }, 'json');
        }
    }
</script>